import Components from 'unplugin-vue-components/webpack';
import NutUIResolver from '@nutui/auto-import-resolver';

import { UnifiedWebpackPluginV5 } from 'weapp-tailwindcss/webpack';
import path from 'path';

const config = {
	projectName: 'bentopage_group',
	date: '2024-6-2',
	designWidth(input) {
		if (input?.file?.replace(/\\+/g, '/').indexOf('@nutui') > -1) {
			return 375;
		}
		return 750;
	},
	deviceRatio: {
		640: 2.34 / 2,
		750: 1,
		828: 1.81 / 2,
		375: 2 / 1,
	},
	sourceRoot: 'src',
	outputRoot: 'dist',
	plugins: ['@tarojs/plugin-html'],
	alias: {
		'@': path.resolve(__dirname, '..', 'src/'),
	},
	// 持久化缓存配置
	cache: {
		enable: true,
	},
	defineConstants: {},
	copy: {
		patterns: [],
		options: {},
	},
	framework: 'vue3',
	compiler: {
		type: 'webpack5',
		prebundle: {
			enable: false, // 关闭预编译
			force: true, // 强制开启预编译
			exclude: ['taro-ui'], // 需要排除预编译的模块
		},
	},
	sass: {
		data: `@import "@nutui/nutui-taro/dist/styles/variables.scss";`,
	},
	mini: {
		//忽略不同文件引用顺序不同导致的警告
		miniCssExtractPluginOption: {
			ignoreOrder: true,
		},
		webpackChain(chain) {
			chain.plugin('unplugin-vue-components').use(
				Components({
					resolvers: [
						NutUIResolver({
							importStyle: 'sass',
							taro: true,
						}),
					],
				})
			),
				chain.merge({
					plugin: {
						install: {
							plugin: UnifiedWebpackPluginV5,
							args: [
								{
									appType: 'taro',
								},
							],
						},
					},
				});
		},
		postcss: {
			pxtransform: {
				enable: true,
				config: {
					// selectorBlackList: ['nut-']
				},
			},
			url: {
				enable: true,
				config: {
					limit: 1024, // 设定转换尺寸上限
				},
			},
			cssModules: {
				enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
				config: {
					namingPattern: 'module', // 转换模式，取值为 global/module
					generateScopedName: '[name]__[local]___[hash:base64:5]',
				},
			},
			htmltransform: {
				enable: false,
				// 设置成 false 表示 不去除 * 相关的选择器区块
				// 假如开启这个配置，它会把 tailwindcss 整个 css var 的区域块直接去除掉
				config: {
					removeCursorStyle: false,
				},
			},
		},
	},
	h5: {
		webpackChain(chain) {
			chain.plugin('unplugin-vue-components').use(
				Components({
					resolvers: [
						NutUIResolver({
							importStyle: 'sass',
							taro: true,
						}),
					],
				})
			);
		},
		publicPath: '/',
		staticDirectory: 'static',
		esnextModules: ['nutui-taro', 'icons-vue-taro'],
		postcss: {
			autoprefixer: {
				enable: true,
				config: {},
			},
			cssModules: {
				enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
				config: {
					namingPattern: 'module', // 转换模式，取值为 global/module
					generateScopedName: '[name]__[local]___[hash:base64:5]',
				},
			},
		},
	},
};

module.exports = function (merge) {
	if (process.env.NODE_ENV === 'development') {
		return merge({}, config, require('./dev'));
	}
	return merge({}, config, require('./prod'));
};
